import React, { Component, lazy, Suspense } from 'react';
import { Switch, Route, Redirect } from 'react-router-dom'
import "../styles/home/HomeRouter.scss"

//首页路由
import FooterBox from '../components/FooterBox';
import Loading from './LoadingPage';

var HomePage = lazy(() => import('./HomePage'));
var ClassifyPage = lazy(() => import('./ClassifyPage'));
var AllCommodities = lazy(() => import('./AllCommodities'));
var ShoppingCart = lazy(() => import('./ShoppingCart'));
var MyPage = lazy(() => import('./MyPage'));
var NotFound = lazy(() => import('./NotFound'));

class HomeRouter extends Component {
    render() {
        return (
            <div className='HomeRouter'>
                {/* 首页路由 */}
                {/* 定义二级路由规则 */}
                <Suspense fallback={<Loading />}>
                    <Switch>
                        <Route exact path="/home/HomePage" component={HomePage} />
                        <Route exact path="/home/ClassifyPage" component={ClassifyPage} />
                        <Route exact path="/home/AllCommodities" component={AllCommodities} />
                        <Route exact path="/home/ShoppingCart" component={ShoppingCart} />
                        <Route exact path="/home/MyPage" component={MyPage} />
                        <Redirect exact from='/home' to="/home/HomePage" />
                        <Route path="*" component={NotFound} />
                    </Switch>
                </Suspense>

                <FooterBox/>
            </div>
        );
    }
}

export default HomeRouter;